<template>
  <public-dialog
          ref="publicDialogRef"
          v-bind="$attrs"
        >
        <el-form ref="formRef" :model="form" :rules="rules" label-width="120">
          <el-form-item label="年度" prop="year">
              <el-date-picker
                      clearable
                      v-model="form.year"
                      type="year"
                      size="large"
                      class="m-l10"
                      value-format="YYYY"
                      placeholder="请选择"
              />
          </el-form-item>
          <el-form-item label="全年经营预算" prop="fileList">
              <FileMinioUpload
                      :restriction="true"
                      :restrictionLimit="9"
                      v-model:files="form.fileList"
              />
          </el-form-item>
        </el-form>
  </public-dialog>
</template>

<script setup>
import PublicDialog from "@/components/PublicDialog.vue";
import {ElDatePicker, ElForm, ElFormItem} from "element-plus";
import {getCurrentInstance, nextTick, onMounted, reactive, ref, watch} from "vue";
import FileMinioUpload from "@/components/FileMinioUpload.vue";

// 获取实例方法
const instance = getCurrentInstance();
const publicDialogRef = ref(null);
const formRef = ref(null);

onMounted(() => {
    // 把el-form方法注入到实例的exposed中
    nextTick(()=>{
        if(publicDialogRef.value){
            const entries = Object.entries(publicDialogRef.value.$.exposed)
            for (const [key, value] of entries) {
                instance.exposed[key] = value
            }
        }
    });

    nextTick(()=>{
        if(formRef.value){
            const entries2 = Object.entries(formRef.value.$.exposed)
            for (const [key, value] of entries2) {
                instance.exposed[key] = value
            }
        }
    });
});

const form = reactive({
    projectId:'',
    year:'',
    fileList:[]
});

const rules = {
    year: [{ required: true, message: '年份不能为空!', trigger: 'change' }],
    fileList: [{ required: true, message: '请上传附件!', trigger: 'change' }]
}

// 暴露方法出去
defineExpose({ ...instance.exposed,form});
</script>

<style scoped>

</style>
